body, button, dd, dl, dt, h1, h2, h3, h4, h5, h6, img, input, li, ol, p, select, table, td, textarea, th, tr, ul {
    border: none;
    margin: 0;
    padding: 0;
    list-style: none;
    font-family: PingFangSC-Regular,Microsoft YaHei,Heiti,Arial,Helvetica,"sans-serif";
}

body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, ul, ol, li, pre, form, fieldset, legend, button, input, textarea, th, td {
  margin: 0;
  padding: 0
}

*{
	-webkit-user-select: none;
}

body, button, input, select, textarea {
  font-family: "Microsoft YaHei", "SimSun", Verdana;
 /*  font-size: 12px */
}

h1, h2, h3, h4, h5, h6 {
  font-size: 100%
}

address, cite, dfn, em, var {
  font-style: normal
}

code, kbd, pre, samp {
  font-family: courier new, courier, monospace
}

ul, ol {
  list-style: none
}

a {
  text-decoration: none
}

.scroll_content::-webkit-scrollbar {
    width:0px;
    height:0px;
}
.scroll_content::-webkit-scrollbar-button    {
    background-color:rgba(0,0,0,0);
}
.scroll_content::-webkit-scrollbar-track     {
    background-color:rgba(0,0,0,0);
}
.scroll_content::-webkit-scrollbar-track-piece {
    background-color:rgba(0,0,0,0);
}
.scroll_content::-webkit-scrollbar-thumb{
    background-color:rgba(0,0,0,0);
}
.scroll_content::-webkit-scrollbar-corner {
    background-color:rgba(0,0,0,0);
}
.scroll_content::-webkit-scrollbar-resizer  {
    background-color:rgba(0,0,0,0);
}
.scroll_content::-webkit-scrollbar {
    width:10px;
    height:10px;
}
/*o内核*/
.scroll_content .-o-scrollbar{
    -moz-appearance: none !important;   
    background: rgba(0,255,0,0) !important;  
}
.scroll_content::-o-scrollbar-button    {
    background-color:rgba(0,0,0,0);
}
.scroll_content::-o-scrollbar-track     {
    background-color:rgba(0,0,0,0);
}
.scroll_content::-o-scrollbar-track-piece {
    background-color:rgba(0,0,0,0);
}
.scroll_content::-o-scrollbar-thumb{
    background-color:rgba(0,0,0,0);
}
.scroll_content::-o-scrollbar-corner {
    background-color:rgba(0,0,0,0);
}
.scroll_content::-o-scrollbar-resizer  {
    background-color:rgba(0,0,0,0);
}
/*IE10,IE11,IE12*/
.scroll_content{
    -ms-scroll-chaining: chained;
    -ms-overflow-style: none;
    -ms-content-zooming: zoom;
    -ms-scroll-rails: none;
    -ms-content-zoom-limit-min: 100%;
    -ms-content-zoom-limit-max: 500%;
    -ms-scroll-snap-type: proximity;
    -ms-scroll-snap-points-x: snapList(100%, 200%, 300%, 400%, 500%);
    -ms-overflow-style: none;
    overflow: auto;
}


a:hover {
  text-decoration: none;
}

.root-game {
    background: #211b47
}

.kd-page-game .canvas-bg {
    display: none
}

*,:after,:before {
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box
}

body,html {
    height: 100%
}

html {
    font-size: 10px;
    background: #211b47
}

body {
    margin: 0;
    font: 16px/1.5 Arial,\\\5FAE\\8F6F\\96C5\\9ED1,Microsoft Yahei,Hiragino Sans GB,\\\5B8B\\4F53,sans-serif;
    font: 1.6rem/1.5 Arial,\\\5FAE\\8F6F\\96C5\\9ED1,Microsoft Yahei,Hiragino Sans GB,\\\5B8B\\4F53,sans-serif
}

.clearfix:after,.clearfix:before {
    content: "";
    display: table
}

.clearfix:after {
    clear: both
}

a {
    color: #fff;
    text-decoration: none
}

.canvas-container,.kd-page {
    width: 100%;
    height: 100%
}

.canvas-bg {
    position: absolute;
    top: 0;
    left: 0
}

.canvas-container,.error404,.kd-menu {
    position: relative;
    z-index: 1;
    text-align: center
}

.canvas-container:before,.canvas-container canvas {
    display: inline-block;
    vertical-align: middle
}

.canvas-container:before {
    content: "";
    width: 0;
    height: 100%
}

.canvas-loading {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 9;
    background: linear-gradient(#211b47,#373060 40%,#373060 60%,#211b47);
    background: -webkit-linear-gradient(#211b47,#373060 40%,#373060 60%,#211b47);
    text-align: center;
    color: #fff
}

.loading-container {
    width: 90%;
    max-width: 300px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
    font-size: 24px
}

.loading-bar {
    width: 100%;
    height: 16px;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 1px 2px rgba(0,0,0,.75),inset 0 1px 5px rgba(0,0,0,.75);
    -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.75),0 1px 5px rgba(0,0,0,.75) inset;
    margin: 10px auto;
    position: relative
}

.loading-bar-inner {
    background: linear-gradient(#ffe60b,#f37e06);
    background: -webkit-linear-gradient(#ffe60b,#f37e06);
    border-radius: 16px;
    -webkit-border-radius: 16px;
    position: absolute;
    top: 0;
    left: 0;
    height: 100%
}

.loading-bar-percent {
    position: absolute;
    left: 50%;
    bottom: 100%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    margin-bottom: 10px;
    font-size: 16px
}

.loading-text {
    color: hsla(0,0%,100%,.75)
}

.kd-sticky-center-box {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0
}

.kd-sticky-center-box:before {
    content: "";
    height: 100%;
    width: 0
}

.kd-sticky-center-box-inner,.kd-sticky-center-box:before {
    display: inline-block;
    vertical-align: middle
}

.error404,.kd-menu {
    color: #ffca00;
    font-size: 3rem
}

.kd-menu ul {
    list-style: none;
    padding-left: 0
}

.kd-menu a {
    color: #fff;
    text-decoration: none
}

.kd-menu a:hover {
    color: red
}

.kd-message {
    font-size: 1em;
    width: 300px;
    background: #fff;
    box-shadow: 0 0 3px #000;
    border-radius: .25em;
    padding: .5em 2em .5em 2.75em;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #353535;
    position: fixed;
    top: 12%;
    left: 50%;
    margin-left: -150px;
    z-index: 1
}

.kd-message-icon {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    width: 2em;
    background: #000;
    color: #fff;
    text-align: center;
    font-size: 1.2em;
    font-style: normal;
    line-height: 2.125em;
    font-weight: 700
}

.kd-message-close {
    position: absolute;
    right: .5em;
    top: 50%;
    margin-top: -.625em;
    font-size: 1em;
    color: #000;
    text-decoration: none
}

.kd-message-close-icon {
    display: block;
    width: 1.25em;
    height: 1.25em;
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    position: relative
}

.kd-message-close-icon:after,.kd-message-close-icon:before {
    content: "";
    display: block;
    height: 100%;
    width: 100%;
    background: currentColor;
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -50% 0 0 -50%
}

.kd-message-close-icon:before {
    height: 2px;
    margin-top: -1px
}

.kd-message-close-icon:after {
    width: 2px;
    margin-left: -1px
}

.kd-message-info-icon {
    background: #09f
}

.kd-message-info-icon:before {
    content: "i"
}

.kd-message-info-close {
    color: #09f
}

.kd-message-warn-icon {
    background: #05f
}

.kd-message-warn-icon:before {
    content: "!"
}

.kd-message-warn-close {
    color: #05f
}

.kd-message-error-icon {
    background: #900
}

.kd-message-error-icon:before {
    content: "!"
}

.kd-message-error-close {
    color: #900
}

.kd-message-success-icon {
    background: #090
}

.kd-message-success-icon:before {
    content: ":)"
}

.kd-message-success-close {
    color: #090
}

.kd-message-prompt {
    padding: 0
}

.kd-message-prompt-head {
    padding: .75rem 1rem;
    background: url(/pc-static/img/bjl/game_rule_head.png) -10px -10px no-repeat;
    background-size: 300%;
    color: #ffdc00;
    text-align: center;
    border-bottom: 1px solid #333
}

.kd-message-prompt-body {
    padding: 2rem 1rem;
    text-align: center;
    background: #fff;
    color: #373063
}

.kd-message-prompt-foot {
    text-align: center
}

.kd-message-button {
    float: left;
    width: 50%;
    padding: .75rem 2rem;
    background: #c09507;
    color: #fff;
    text-decoration: none
}

.kd-message-button-cancel {
    background: #a86509
}

.animated {
    animation-duration: .35s;
    -webkit-animation-duration: .35s;
    animation-fill-mode: .35s;
    -webkit-animation-fill-mode: .35s
}

.animated.infinite {
    animation-iteration-count: infinite;
    -webkit-animation-iteration-count: infinite
}

@keyframes a {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.3,.3,.3);
        transform: scale3d(.3,.3,.3)
    }

    50% {
        opacity: 1
    }
}

@-webkit-keyframes a {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.3,.3,.3)
    }

    50% {
        opacity: 1
    }
}

.zoom-in {
    animation-name: a;
    -webkit-animation-name: a
}

@keyframes b {
    20% {
        -webkit-transform: scale3d(.9,.9,.9);
        transform: scale3d(.9,.9,.9)
    }

    50%,55% {
        opacity: 1;
        -webkit-transform: scale3d(1.1,1.1,1.1);
        transform: scale3d(1.1,1.1,1.1)
    }

    to {
        opacity: 0;
        -webkit-transform: scale3d(.3,.3,.3);
        transform: scale3d(.3,.3,.3)
    }
}

@-webkit-keyframes b {
    20% {
        -webkit-transform: scale3d(.9,.9,.9)
    }

    50%,55% {
        opacity: 1;
        -webkit-transform: scale3d(1.1,1.1,1.1)
    }

    to {
        opacity: 0;
        -webkit-transform: scale3d(.3,.3,.3)
    }
}

.bounce-out {
    animation-name: b;
    -webkit-animation-name: b
}

.game-rule-promptbox {
    background: rgba(0,0,0,.5);
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 10000;
}

.grp-box {
    width: 690px;
    border: 2px solid #764bf7;
    background: #450eab;
   /*  background: linear-gradient(top,#47218e,#5e2cbb 54%,#47218e);
    background: -webkit-linear-gradient(top,#47218e,#5e2cbb 54%,#47218e); */
    box-shadow: 0 0 30px rgba(147,99,237,.35),inset 0 3px 7px rgba(84,17,149,.35);
    -webkit-box-shadow: 0 0 30px rgba(147,99,237,.35),inset 0 3px 7px rgba(84,17,149,.35);
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    color: #ecddff;
    font-size: 18px;
    line-height: 2;
    text-align: left
}

.grp-box:after {
    content: "";
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    top: 0;
    background: url(/pc-static/img/bjl/game_rule_light.png) no-repeat bottom;
    background-size: 100%
}

.grp-body,.grp-foot,.grp-head {
    position: relative;
    z-index: 1
}

.grp-head {
    margin: -7px -7px 0;
    height: 84px;
    background: url(/pc-static/img/bjl/game_rule_head.png) no-repeat;
    color: transparent
}

.grp-body {
    height: 421px;
    overflow: auto;
    margin: 10px 20px
}

.grp-foot {
    padding: 10px 0
}

.grp-close {
    display: block;
    width: 143px;
    height: 58px;
    background: url(/pc-static/img/bjl/button_close.png) no-repeat;
    color: transparent;
    margin: 0 auto
}

.grp-body .title {
    font-weight: 700;
    border-bottom: 1px dashed hsla(0,0%,100%,.2);
    padding-bottom: 10px;
    margin-bottom: 20px;
    text-align: center
}

.grp-body .title span {
    color: #d4a013;
    margin-left: 10px
}

.grp-body .table {
    border: 1px solid hsla(0,0%,100%,.2);
    font-size: 16px;
    margin-bottom: 10px
}

.grp-body .table>div {
    border-top: 1px solid hsla(0,0%,100%,.2)
}

.grp-body .table>div:first-child {
    border-top-width: 0
}

.grp-body .table>div:after,.grp-body .table>div:before {
    content: "";
    display: table
}

.grp-body .table>div:after {
    clear: both
}

.grp-body .table>div>div {
    float: left;
    width: 70%;
    border-left: 1px solid hsla(0,0%,100%,.2);
    padding: 5px 10px
}

.grp-body .table>div>div:first-child {
    border-left-width: 0;
    width: 30%;
    text-align: center
}

.grp-body .table>div:first-child>div {
    background: hsla(0,0%,100%,.2);
    text-align: center
}

.grp-body .red {
    color: #d4a013
}

.grp-body .list>div {
    padding-left: 20px;
    position: relative
}

.grp-body .list>div:before {
    content: "";
    position: absolute;
    top: 14px;
    left: 0;
    display: block;
    width: 10px;
    height: 10px;
    background: #fff;
    opacity: .3;
    border-radius: 50%
}

.wapper{
	width:100%;
	height: 100%;
	background: url(/pc-static/img/bjl/bg.jpg) no-repeat center;
	   
}

.wapper .container{
	background: url(/pc-static/img/bjl/rooms_container.png) no-repeat center;
	position:fixed;
	left:0;
	top:0;
	right:0;
	bottom:0;
	width:1024px;
    height: 700px;
    margin: 0 auto;
    margin-top:100px; 
	/*  transform: scale(1);
    position: fixed;
    left:100px;
    top: 100px;
    width:1024px;
    height: 700px; */
/* 	width:50%;
	height:70%;
	margin: auto;
	margin-top:15%; */
}

.wapper .header{
	height: 115px;
	margin-top:15px;
	overflow: hidden;
}

.wapper .header .bjlbanner{
	float:left;
	background: url(/pc-static/img/bjl/game_name.png) no-repeat 100% 100%;
	width:241px;
	height: 77px;
	margin-left: 30px;
    margin-top: 19px;
}

.wapper .header .opreate-content{
	float:right;
	margin-right: 25px;
}

.wapper .header .opreate-content div{
	float: right;
    background: url(/pc-static/img/bjl/button_bg.png) no-repeat 100% 100%;
    width: 143px;
    height: 58px;
    margin-top: 10px;
    margin-left: 10px;
    text-align: center;
    font-family: serif;
    font-size: 24px;
    font-weight: 700;
    padding-top: 6px;
    color: #f3ecec;
    cursor: pointer;
}

.wapper .main{
/* 	height: 560px;
	width:100%;
	 */
}

.wapper .main ul{
	 flex-grow: 1;
    width: 100%;
    height: 560px;
    margin-top: 10px;
    padding: 0 50px;
}
.wapper .main ul li{
	float:left;
	width:449px;
	height: 171px;
	padding:0 30px;
	position: relative;
	cursor: pointer;
}

.wapper .main ul li:nth-child(2n){
	 background: url(/pc-static/img/bjl/room_item_bg_2.png) no-repeat 100% 100%;
    margin-bottom: 10px;
    margin-left: 12px;
}

.wapper .main ul li:nth-child(2n+1){
	background: url(/pc-static/img/bjl/room_item_bg.png) no-repeat 100% 100%;
    margin-bottom: 10px;
    margin-right: 12px;
}

.wapper .main ul li:nth-child(1) .photo,.main ul li:nth-child(2) .photo{
	background: url(/pc-static/img/bjl/portrait01.png) no-repeat 100% 100%;
	
}
.wapper .main ul li:nth-child(3) .photo,.main ul li:nth-child(4) .photo{
	background: url(/pc-static/img/bjl/portrait02.png) no-repeat 100% 100%;
	
}
.wapper .main ul li:nth-child(5) .photo,.main ul li:nth-child(6) .photo{
	background: url(/pc-static/img/bjl/portrait03.png) no-repeat 100% 100%;
	
}
.wapper .main ul li .photo{
	position: absolute;
    width: 145px;
    height: 158px;
    left: 10px;
    top: 8px;
}

.wapper .main ul li .state{
	    position: absolute;
    background: url(/pc-static/img/bjl/room_state.png) no-repeat 100% 100%;
    width: 132px;
    height: 56px;
    left: 160px;
    top: 70px;
    /* padding-left: 30px; */
    text-align: center;
    line-height: 56px;
    color: #f2f2f2;
    font-family: serif;
    font-size: 24px;
    font-weight: 700;
}

.wapper .main ul li .seconds{
	position: absolute;
    background: url(/pc-static/img/bjl/room_countdown.png) no-repeat 100% 100%;
    width: 71px;
    height: 71px;
    left: 270px;
    top: 60px;
    text-align: center;
    line-height: 71px;
    color: redx;
    color: #d00c0c;
    font-size: 26px;
    font-weight: 700;
}

.wapper .main ul li .money{
	    position: absolute;
    left: 170px;
    top: 25px;
    color: #fff;
    font-style: italic;
    font-size: 28px;
    font-weight: 700;
	/* background: url(/pc-static/img/bjl/room_item_bg_2.png) no-repeat 100% 100%; */
}

.wapper .main ul li .room{
	position: absolute;
    background: url(/pc-static/img/bjl/room_number.png) no-repeat 100% 100%;
    width: 102px;
    text-align: center;
    line-height: 65px;
    height: 69px;
    right: 25px;
    top: 15px;
    color: #eaea0d;
    font-family: -webkit-pictograph;
    font-size: 24px;
}
.wappering{
	width:100%;
	height: 100%;
	position: relative;
}

.containers{
	position:fixed;
	left:0;
	top:0;
	right:0;
	bottom:0;
	width:1200px;
    height: 100%;
    margin: 0 auto;
}

.headers{
	width:100%;
	height: 73px;
	background: url(/pc-static/img/bjl/game_bar_bg.png) no-repeat 100% 100%;
	overflow: hidden;
	position: relative;
}


.headers .back{
	float: left;
	background: url(/pc-static/img/bjl/back.png) no-repeat 100% 100%;
	width:52px;
	height: 49px;
	margin-left: 20px;
	margin-top: 12px;
	cursor: pointer;
}

.headers .rooming{
 	text-align: center;
    position: absolute;
    left: 50%;
    line-height: 73px;
    margin-left: -36px;
    font-size: 28px;
    font-weight: 700;
    color: #d28839;
    margin-left: 50;
    font-family: serif;
    float: left;
}

.headers .message{
	float: right;
}

.headers .message .preiod{
	float: right;
    width: 172px;
    height: 66px;
    background: url(/pc-static/img/bjl/people_bg.png) no-repeat 100% 100%;
    margin-right: 10px;
    margin-top: 3px;
    color: #fff;
    text-align: center;
    line-height: 66px;
}

.headers .message .bg_sound{
	float: right;
    width: 48px;
    height: 48px;
    background: url(/pc-static/img/bjl/button_bg_music.png) no-repeat 100% 100%;
    margin-top: 12px;
    margin-right: 10px;
    cursor: pointer;
}

.headers .message .bg_sound .sound{
	background: url(/pc-static/img/bjl/button_bg_music_2.png) no-repeat 100% 100%;
	width:48px;
	height: 48px;
}

.mains{
	position: relative;
	height: 580px;
	width: 100%;
	background: #373060;
	color:#fff;
	font-size: 20px;
}	

.mains .userMessage{
	position: absolute;
	background: url(/pc-static/img/bjl/message_box_bg.png) no-repeat 100% 100%;
	left: -3px;
	top:-3px;
	width: 368px;
    height: 227px;
}

.mains .notice{
	position: absolute;
	background: url(/pc-static/img/bjl/message_box_bg.png) no-repeat 100% 100%;
	right: -3px;
	top:-3px;
    width: 368px;
    height: 227px;
}

.mains .userMessage .header{
	height: 60px;
	 text-align: center;
	 overflow: hidden;
}

.mains .userMessage .header .arrowLeft{
	background: url(/pc-static/img/bjl/arrow.png) no-repeat 100% 100%;
	width:85px;
	height: 34px;
	display: block;
	float: left;
	margin-top: 20px;
	margin-left: 40px;
}

.mains .userMessage .header .arrowRight{
	background: url(/pc-static/img/bjl/arrow2left.png) no-repeat 100% 100%;
	width:85px;
	height: 34px;
	display: block;
	float: right;
	margin-top: 20px;
	margin-right:40px;
}

.mains .userMessage .header em{
    line-height: 70px;
    font-size: 32px;
    color: #b1a476;
    font-family: monospace;
}
.mains .userMessage .content div{
	width:70%;
	margin: 0 auto;
	margin-top: 30px;
}

.mains .userMessage .content div span{
	color:#fff;
	font-size: 20px;
	margin-right: 10px;
}

.mains .userMessage .content input{
	background: url(/pc-static/img/bjl/message_item.png) no-repeat 100% 100%;
    width: 139px;
    height: 30px;
    text-align: center;
    color: #9d8503;
    font-size: 18px;
    font-weight: 700;
}

.mains .notice .title{
	 line-height: 70px;
    font-size: 32px;
    color: #b1a476;
    font-family: monospace;
    text-align: center;
} 

.mains .notice .content{
	position: relative;
	padding: 10px;
	color:#d7a97c;
	font-size: 20px;
	padding-left: 60px;}

.mains .notice .content:before{
	content: '';
	position: absolute;
	background: url(/pc-static/img/bjl/bell.png) no-repeat 100% 100%;
	display:block;
	width:21px;
	height: 24px;
	left: 30px;
	top:12px;
}

.mains .YcutDown{
	position: absolute;
    left: 50%;
    width: 120px;
    height: 120px;
    border-radius: 50%;
    margin-left: -60px;
    background: #c0becd;
    display: block;
    top: 30px;
}

.mains .tips{
	position: absolute;
    width: 240px;
    height: 60px;
    background: #251d33;
    line-height: 60px;
    opacity: 0.5;
    left: 39.7%;
    top: 175px;
    text-align: center;
    line-height: 60px;
    font-weight: 700;
    font-size: 32px;
    color: #f81d00;
}


.mains .YcutDown .cutDown{
	display: block;
    width:90px;
    height: 90px;
    margin-left: 15px;
    margin-top: 15px;
    border-radius: 50%;
    background: #fff;
    text-align: center;
    line-height: 90px;
    color: #4c282d;
    font-size: 50px;
}

.mains .xianPrint{
	position: absolute;
    background: url(/pc-static/img/bjl/print.png) no-repeat 100% 100%;
    width: 100px;
    height: 144px;
    background-size: cover;
    left: 35%;
    top: 135px;
}

.mains .zhuangPrint{
	position: absolute;
	background: url(/pc-static/img/bjl/print.png) no-repeat 100% 100%;
	width: 100px;
    height: 144px;
    background-size: cover;
    left: 56.5%;
    top: 135px;
}

.mains .xianBox{
	position: absolute;
	background: url(/pc-static/img/bjl/point.png) no-repeat 100% 100%;
	width:90px;
	height: 74px;
	left: 110px;
    bottom: 60px;
        text-align: center;
    font-size: 42px;
    line-height: 74px;
}

.mains .xian{
	width:120px;
	height: 120px;
	border-radius:50%;
	border: 5px solid #fff;
	position: absolute;
	left: 220px;
	bottom: 60px;
	text-align: center;
	cursor: pointer;
}

.mains .xian .Xname{
	height: 80px;
    font-size: 65px;
    font-weight: 900;
}

.mains .betArea{
	width: 470px; 
    height: 220px;
    position: absolute;
    bottom: 50px;
    right: 365px;
    border-radius: 10px;
    border: 1px solid #fff;
    overflow: hidden;
}

.mains .betArea .pair{
	height: 110px;
	border-bottom: 1px solid #fff;
}

.mains .betArea .pair li{
	width:25%;
	border-right: 1px solid #fff;
	float: left;
	box-sizing: border-box;
	height: 100%;
	text-align: center;
    padding: 15px 0;
    cursor: pointer;
}

.mains .betArea .pair li div:first-child{
	font-size: 24px;
}

.mains .betArea .pair li:last-child{
	border-right: none;
}

.mains .betArea .size{
	height: 110px;
}

.mains .betArea .size li{
	width:33.333%;
	border-right: 1px solid #fff;
	float: left;
	box-sizing: border-box;
	height: 100%;
	text-align: center;
    padding: 15px 0;
    cursor: pointer;
}

.mains .betArea .size li div:first-child{
	font-size: 24px;
}

.mains .betArea .size li:last-child{
	border-right: none;
}

.mains .zhuang{
	width:120px;
	height: 120px;
	border-radius:50%;
	border: 5px solid #fff;
	position: absolute;
	right: 220px;
	bottom: 60px;
	text-align: center;
	cursor: pointer;
}

.mains .zhuang .Zname{
	height: 80px;
    font-size: 65px;
    font-weight: 900;
}


.mains .systemSound{
	position: absolute;
    right: 10px;
    bottom: 100px;
    text-align: center;
    right: 10px;
    bottom: 90px;
    cursor: pointer;
}

.mains .systemSound .onSound{
	background: url(/pc-static/img/bjl/volume.png) no-repeat 100% 100%;
	width:32px;
	height: 32px;
	margin-left:24px;
}

.mains .systemSound .offSound{
	background: url(/pc-static/img/bjl/volume2.png) no-repeat 100% 100%;
	width:32px;
	height: 32px;
	margin-left:24px;
}


.mains .zhuangBox{
	position: absolute;
	background: url(/pc-static/img/bjl/point.png) no-repeat 100% 100%;
	width:90px;
	height: 74px;
	right: 110px;
    bottom: 60px;
    text-align: center;
    line-height: 74px;
    font-size:42px;
}

.mains .help{
	position: absolute;
    right: 15px;
    bottom: 20px;
    width: 70px;
    text-align: center;
    cursor: pointer;
}

.mains .help .question{
	background: url(/pc-static/img/bjl/question.png) no-repeat 100% 100%;
	width:32px;
	height: 32px;
	margin-left: 19px;
}

.footer{
	height: 240px;
	width:100%;
	position: relative;
}

.footer .jettonArea{
	height: 73px;
	width:100%;
	overflow:hidden;
	background: url(/pc-static/img/bjl/game_bar_bg.png) no-repeat 100% 100%;
}

.footer .jettonArea .roomSwitch{
	float: left;
	background: url(/pc-static/img/bjl/button_change_room.png) no-repeat 100% 100%;
	width:142px;
	height: 45px;
	margin-top: 12px;
	margin-left: 20px;
}

.footer .jettonArea .jetton{
	position: absolute;
    left: 50%;
    margin-left: -181px;
    right: 0;
    bottom: 0;
    top: 0;
    background: url(/pc-static/img/bjl/chip_bar_bg.png) no-repeat 100% 100%;
    width: 363px;
    height: 60px;
    margin-top: 3px;
}

.footer .jettonArea .jetton ul{
	list-style: none;
    /* overflow: hidden; */
    padding-left: 42px;
}

.footer .jettonArea .jetton ul li{
	/* background: url(/img/caizhong/bjl/coin-5-2x.png) no-repeat 100% 100%; */
    width: 46px;
    height: 46px;
    margin: 0 5px;
    line-height:46px;
    float: left;
    background-size: contain;
    cursor: pointer;
    text-align: center;
    font-size: 12px;
    font-weight: 700;
    z-index:101;
}

.footer .jettonArea .jetton ul li.gameCoin-large{
	transform: scale(1.1);
    transition: all 0.3s;
    position: relative;
    bottom: 10px;
}

.footer .jettonArea .jetton ul li.gameCoin-large:after{
    content: "";
    border: 2px solid rgba(230, 187, 12, 0.7);
    box-shadow: -1px 1px 6px 2px rgba(251, 203, 12, 0.8);
    display: block;
    border-radius: 50%;
    position: absolute;
    top: 2px;
    left: 0;
    bottom: 2px;
    right: 0;
}

.footer .jettonArea .jetton ul li:nth-child(1){
	background: url(/pc-static/img/bjl/chip1.png) no-repeat 100% 100%;
	color:#1e7d86;
}

.footer .jettonArea .jetton ul li:nth-child(2){
	background: url(/pc-static/img/bjl/chip2.png) no-repeat 100% 100%;
	color:#2c7739;
}

.footer .jettonArea .jetton ul li:nth-child(3){
	background: url(/pc-static/img/bjl/chip3.png) no-repeat 100% 100%;
	color:#233875;
}

.footer .jettonArea .jetton ul li:nth-child(4){
	background: url(/pc-static/img/bjl/chip4.png) no-repeat 100% 100%;
	color:#8a1a53;
}

.footer .jettonArea .jetton ul li:nth-child(5){
	background: url(/pc-static/img/bjl/chip5.png) no-repeat 100% 100%;
	color:#3a4148;
}

.footer .jettonArea .btn{
	color: #cecece;
    float: right;
    margin-right: 5px;
    background: url(/pc-static/img/bjl/button_bg_highlight.png) no-repeat 100% 100%;
    width: 114px;
    height: 46px;
    margin-top: 13.5px;
    text-align: center;
    line-height: 40px;
    font-weight: 700;
    font-family: monospace;	
    cursor: pointer;	
}

.footer .lotterRecord {
	height: 177px;
	background: #270906;
	margin-top: -5px;
}

.selected:hover{
    background: #6e65a2;
    color: yellow;
}

@keyframes rotate{
    0%{
        transform: rotate(0);
      }
   /*  50%{
    	transform:rotate(200deg);
    } */
    100%{
         transform: rotate(360deg);
    	}
	}
 
.rotate{
    transition: 0.5s;
  /*   transform-origin: 30px 30px;   */
    animation: rotate 10s linear infinite;  /*开始动画后无限循环，用来控制rotate*/
}

.wappering .room-div{
	position: absolute;
    top: 385px;
    left: 21px;
    width: 140px;
    z-index: 1000;
    text-align: center;
    border: 1px solid #a04015;
    border-bottom: navajowhite;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    padding: 0 10px;
    padding-bottom: 5px;
    background: #211b47;
    display: none;
}

.wappering .room-div ul li{
	border-bottom: 1px solid #a04015;
    color: #fff;
    font-size: 20px;
    height: 35px;
    line-height: 35px;
    font-family: -webkit-pictograph;
    cursor:pointer;
}

.wappering .room-div ul li:last-child {
	border-bottom: none;
    height: 30px;
}

.wappering .room-div ul li:hover{
	color:yellow;
	background: #5d5975;
}

.class-img-smallCoin{
	position: fixed;
	width:35px;
	height: 35px;
	z-index:100;
 	/* bottom: 300px;
    left: 500px;  */
    transform: rotateX(60deg);
    background-size: cover !important;
    transition: all 1s;
}

.class-img-fakeCoins{
	 transition: all 0.4s;
	 position: fixed;
	width:35px;
	height: 35px;
	z-index:100;
	 transform: rotateX(60deg);
    background-size: cover !important;
}

.class-img-smallCoin:before{
    /* content: "";
    border: 2px solid rgba(230, 187, 12, 0.7);
    box-shadow: -1px 1px 6px 2px rgba(251, 203, 12, 0.8);
    display: block;
    border-radius: 50%;
    position: absolute;
    top: 2px;
    left: 0;
    bottom: 2px;
    right: 0; */
}

 .selected{
	position: relative;
} 

.tiped{
	font-size:20px;
}

.mains .betArea ul li{
	line-height: 40px;
	padding:15px 0;
}

.money{
	position: fixed;
    z-index: 103;
    color: #24f202;
    display: none;
    color: #24f202;
    font-size: 12px;
    width: 36px;
    text-align: center;
}

.cardItemRight.slow{
	transition: all 1s;
}

.cardItemRight {
    position: absolute;
    transform: scale(0.6);
    transition: all 0.3s;
    top: 190px;
    right: 420px;
    width:70px;
	height: 105px;
}

.cardItemLeft{
	 position: absolute;
    transform: scale(1); 
    transition: all 0.3s;
    top: 190px;
    left:420px;
}


.class-img-pockCard{
	/* width:70px;
	height: 105px; */
	 width:100px;
	height: 144px;
}

.cardItemLeft.slow {
    transition: all 0.6s;
}

.mains .list {
    position: absolute;
}

.class-getResultHightLightDiv {
		animation: highLight 2s; 
		animation-timing-function: linear;
		 animation-iteration-count: 1; 
		 background: #6e65a2;
   		 color: yellow;
	}
	
	
.wanfa{
	padding:10px 20px;
}

.red{
	color:#f61e3d;	
}

.blue{
	color:#222f7c;
}

.green{
	color:#217425;
}

.white{
	color:#fff;
}

.wanfa span{
	margin-right: 10px;
}

.wanfa em{
	margin-right: 20px;
}

.div-box-item .item{
	width: 20px;
    height: 20px;
    border-bottom: 1px solid #808080;
    border-right: 1px solid #808080;
    display: block;
    position:relative;
}

.history .item .span2{
	border:2px solid #0060BF;
}

.history .item .span1{
	 border:2px solid  #BF0005; 
}

.div-box-item .item span {
    border-radius: 50%;
    display: inline-block;
    width: 16px;
    height: 16px;
    line-height:16px;
    position: absolute;
    margin-left: 2px;
    margin-top: 2px;
    text-align: center;
    font-size: 10px;
    font-family: serif;
}

.he1{
	  border-bottom: 2px solid  #238F22;
    transform: rotate(135deg);
    position: absolute;
    left: 5px;
    top: 5px; 
    display: block;
    width: 16px;
    height: 16px; 
}

.he2:before{
	content:"‖";
	/* transform: rotate(135deg); */
    position: absolute;
    color:#238F22;
    left: 5px;
    top: 5px;
    display: block;
    width: 16px;
    height: 16px;
    font-size: 16px;
    transform: rotate(45deg);
}

.he2{
    display: block;
    width: 16px;
    height: 16px;
}

.he3{
    display: block;
    width: 16px;
    height: 16px;
}

.he3:before{
	content:"Ⅲ";
	/* transform: rotate(135deg); */
    position: absolute;
    color:#238F22;
    left: 3px;
    top: 3px;
    display: block;
    width: 16px;
    height: 16px;
    font-size: 16px;
    transform: rotate(45deg);
}


.he4{
    display: block;
    width: 16px;
    height: 16px;
}

.he4:before{
	content:"ⅡⅡ";
	/* transform: rotate(135deg); */Ⅰ
    position: absolute;
    color:#238F22;
    left: 1px;
    top: 1px;
    display: block;
    width: 16px;
    height: 16px;
    font-size: 16px;
    transform: rotate(45deg);
}

.he5{
    display: block;
    width: 16px;
    height: 16px;
}

.he5:before{
	content:"ⅡⅡⅠ";
	/* transform: rotate(135deg); */
    position: absolute;
    color:#238F22;
    left: 0px;
    top: 0px;
    display: block;
    width: 16px;
    height: 16px;
    font-size: 16px;
    transform: rotate(45deg);
}




.history{
	float: left;
	width:720px;
}

.zhuangxianjl{
	float: left;
    width: 220px;
}


.sizejl{
	float: left;
    width: 220px;
}

.history .item1{
	width:20px;
	height: 100%;
	display: inline-block;
	
}

.zhuangxianjl .item1{
	width:20px;
	height: 100%;
	display: inline-block;
	
}

.sizejl .item1{
	width:20px;
	height: 100%;
	display: inline-block;
	
}

.div-box-item{
	    background: #fff;
    display: flex;
    /* width: 100%; */
    height: 120px;
    margin: 0 20px;
    overflow: hidden;
}

.zhuangxianjl .zhuang{
	background:#f61737;
	color:#fff;
}

.zhuangxianjl .xian{
	background:#2059fd;
	color:#fff;
}

.zhuangxianjl .hu{
	background:#20b038;
	color:#fff;
}

.div-box-item .item span.zhuang,.div-box-item .item span.xian{
	border-radius: 50%;
    display: inline-block;
    width: 18px;
    height: 18px;
    line-height:18px;
    position: absolute;
    margin-left: 1px;
    margin-top: 1px;
    text-align: center;
    font-size: 10px;
    font-family: serif;
}

.zhuangxianjl .zhuangpair{
	position: absolute;
	 left:1px;
	top: 1px; 
	width:6px;
	height: 6px;
	border-radius: 50%;
	background:#2bff00;
}

.zhuangxianjl .xianpair{
	position: absolute;
	right:1px;
	bottom: 1px;
	width:6px;
	height: 6px;
	border-radius: 50%;
	background:#ffa500;
}

.sizejl .small{
	color:#3b6dfd;
}

.sizejl .large{
	color:#f7324e;
}



